<template>
  <div>
    <p>
      child---{{ name }} ---{{ age }}---{{ address }}，她的对象是---{{
        person.name
      }}
      ---
      {{ person.age }}
    </p>
    <p>
      <button @click="change">更改内容</button>
    </p>
    <p>
      <button @click="sendParent">传值给父组件</button>
    </p>
  </div>
</template>

<script>
export default {
  // props: ['name', 'age', 'address', 'person'] // 只适合普通的，不需要限制类型的
  props: {
    name: String,
    age: Number,
    address: {
      type: String,
      default: '深圳' // 默认值，没有传的时候，就起作用
    },
    person: Object
  },
  methods: {
    change () {
      // 普通的值类型，虽然能改，但是不建议
      // this.name = '晴晴'
      // 引用类型，改里面的属性的值，可以，但是不建议直接更改引用类型
      // this.person = {
      //   name: '丁真'
      // }
      this.person.name = '彭于晏'
    },
    sendParent () {
      // 子组件触发自定义事件
      this.$emit('myevent', [
        { id: 10001, name: '尹志平' },
        { id: 10002, name: '梅超风' }
      ])
    }
  }
}
</script>
